<template>
  <el-table
    :data="tableData"
    style="width: 100%"
    :header-cell-style="{
      background: 'red',
    }"
  >
    <el-table-column prop="date" label="123123" />
    <el-table-column prop="name" label="Name" />
    <el-table-column prop="address" label="Address" />
  </el-table>
  <test2Com
    ref="test2"
    :aaaa="userName"
    @changeA="changeA"
    @changeName="changeName"
  />
</template>

<script setup>
import { nextTick, ref } from "vue";
import test2Com from "@/components/test/test2Com";
import userInfo from "@/store/userInfo/userInfo.js";

import bus from "@/util/mitt.js";
const userName = ref("张三");

const changeName = () => {
  userName.value = "李四";
};

bus.on("changeAll", (val) => {
  console.log(val);
  changeA();
});
const test2 = ref(null);

nextTick(() => {
  bus.emit("change123", 111111111111111111);
  test2.value.test(22222222222222);
  test2.value.test2(3333333333333333);
});
const ABC = userInfo();

console.log(ABC.userData);

const changeA = () => {
  tableData.value.push({
    date: "1231",
    name: "adsa3123123",
    address: "adsadsad",
  });
};
const tableData = ref([
  {
    date: "2016-05-03",
    name: "Tom",
    address: "No. 189, Grove St, Los Angeles",
  },
  {
    date: "2016-05-02",
    name: "Tom",
    address: "No. 189, Grove St, Los Angeles",
  },
  {
    date: "2016-05-04",
    name: "Tom",
    address: "No. 189, Grove St, Los Angeles",
  },
  {
    date: "2016-05-01",
    name: "Tom",
    address: "No. 189, Grove St, Los Angeles",
  },
]);
</script>

<style lang="less" scoped>
.my-swipe .van-swipe-item {
  color: #fff;
  font-size: 20px;
  line-height: 150px;
  text-align: center;
  background-color: #39a9ed;
}
</style>
